<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>导演信息</title>
</head>
<body>
<h1>恭喜你，<span th:text="${username}"></span> 管理员登录成功！</h1>
<a th:href="@{/adminSuccessPage(username=${username}, page=0, size=10)}">用户信息</a>
<a th:href="@{/adminTicketsPage(username=${username}, page=0, size=10)}">购票信息</a>
<a th:href="@{/adminMoviesPage(username=${username}, page=0, size=10)}">电影信息</a>
<a th:href="@{/adminGenersPage(username=${username}, page=0, size=10)}">类别信息</a>
<a th:href="@{/adminDirectorsPage(username=${username}, page=0, size=10)}">导演信息</a>
<a th:href="@{/adminActorsPage(username=${username}, page=0, size=10)}">演员信息</a>
<a th:href="@{/adminReviewsPage(username=${username}, page=0, size=10)}">评论信息</a>
<form id="searchForm">
    <input type="hidden" th:name="username" th:value="${username}">
    <input type="hidden" th:name="size" th:value="${pageSize}">
    <input type="hidden" th:name="page" th:value="0">
    <label for="searchDname">根据导演名搜索:</label>
    <input type="text" id="searchDname" name="dname">
    <input type="button" value="搜索" onclick="searchDirectors()">
</form>

<button id="addDirectorBtn">增加导演</button>

<h2>导演信息列表</h2>
<table>
    <thead>
    <tr>
        <th>导演编号</th>
        <th>导演名称</th>
        <th>介绍</th>
        <th>生日</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody id="directorTableBody">
    <tr th:each="directors : ${directors}">
        <td th:text="${directors.did}"></td>
        <td th:text="${directors.dname}"></td>
        <td th:text="${directors.biography}"></td>
        <td th:text="${directors.birthdate}"></td>
        <td>
            <button th:onclick="'editDirector(' + ${directors.did} + ')'">修改</button>
            <button th:onclick="'deleteDirector(' + ${directors.did} + ')'">删除</button>
        </td>
    </tr>
    </tbody>
</table>

<!-- 新增导演表单 -->
<div id="addDirectorForm" style="display: none;">
    <h3>新增导演</h3>
    <form id="addDirectorFormData">
        <label for="addDname">导演名称:</label>
        <input type="text" id="addDname" name="dname" required><br>
        <label for="addBiography">介绍:</label>
        <input type="text" id="addBiography" name="biography"><br>
        <label for="addBirthdate">生日:</label>
        <input type="text" id="addBirthdate" name="birthdate"><br>
        <button type="button" onclick="submitAddDirectorForm()">提交</button>
        <button type="button" onclick="cancelAddDirectorForm()">取消</button>
    </form>
</div>

<!-- 修改导演表单 -->
<div id="editDirectorForm" style="display: none;">
    <h3>修改导演信息</h3>
    <form id="editDirectorFormData">
        <input type="hidden" id="editDid" name="did">
        <label for="editDname">导演名称:</label>
        <input type="text" id="editDname" name="dname" required><br>
        <label for="editBiography">介绍:</label>
        <input type="text" id="editBiography" name="biography"><br>
        <label for="editBirthdate">生日:</label>
        <input type="text" id="editBirthdate" name="birthdate"><br>
        <button type="button" onclick="submitEditDirectorForm()">提交</button>
        <button type="button" onclick="cancelEditDirectorForm()">取消</button>
    </form>
</div>

<!-- 分页导航栏 -->
<div>
    <!-- 首页 -->
    <a th:href="@{/adminDirectorsPage(username=${username}, page=0, size=${pageSize})}">首页</a>

    <!-- 上一页 -->
    <a th:if="${currentPage > 0}" th:href="@{/adminDirectorsPage(username=${username}, page=${currentPage - 1}, size=${pageSize})}">上一页</a>

    <!-- 下一页 -->
    <a th:if="${currentPage < totalPages - 1}" th:href="@{/adminDirectorsPage(username=${username}, page=${currentPage + 1}, size=${pageSize})}">下一页</a>

    <!-- 末页 -->
    <a th:href="@{/adminDirectorsPage(username=${username}, page=${totalPages - 1}, size=${pageSize})}">末页</a>

    <!-- 显示当前页和总页数 -->
    <span>当前页: <span th:text="${currentPage + 1}"></span> / 总页数: <span th:text="${totalPages}"></span></span>
    <form th:action="@{/adminDirectorsPage}" method="get">
        <input type="hidden" th:name="username" th:value="${username}">
        <input type="hidden" th:name="size" th:value="${pageSize}">
        <label for="pageNumber">跳转到页数:</label>
        <input type="number" id="pageNumber" name="page" min="0" th:max="${totalPages - 1}" required>
        <input type="submit" value="跳转">
    </form>
</div>

<script>
    function searchDirectors() {
        var dname = document.getElementById('searchDname').value;
        var xhr = new XMLHttpRequest();
        xhr.open('GET', '/director/searchDirector?dname=' + dname, true);
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4 && xhr.status === 200) {
                var response = JSON.parse(xhr.responseText);
                if (response.success) {
                    var directors = response.directors;
                    var tableBody = document.getElementById('directorTableBody');
                    tableBody.innerHTML = '';
                    directors.forEach(function (director) {
                        var row = document.createElement('tr');
                        row.innerHTML = `
                                <td>${director.did}</td>
                                <td>${director.dname}</td>
                                <td>${director.biography}</td>
                                <td>${director.birthdate}</td>
                                <td>
                                    <button th:onclick="'editDirector(' + ${director.did} + ')'">修改</button>
                                    <button th:onclick="'deleteDirector(' + ${director.did} + ')'">删除</button>
                                </td>
                            `;
                        tableBody.appendChild(row);
                    });
                } else {
                    alert(response.error);
                }
            }
        };
        xhr.send();
    }

    document.getElementById('addDirectorBtn').addEventListener('click', function () {
        document.getElementById('addDirectorForm').style.display = 'block';
    });

    function submitAddDirectorForm() {
        var form = document.getElementById('addDirectorFormData');
        var xhr = new XMLHttpRequest();
        xhr.open('POST', '/director/addDirector', true);
        xhr.setRequestHeader('Content-Type', 'application/json');
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4 && xhr.status === 200) {
                var response = JSON.parse(xhr.responseText);
                if (response.success) {
                    alert(response.message);
                    location.reload();
                } else {
                    alert(response.message);
                }
            }
        };
        var data = {
            dname: form.addDname.value,
            biography: form.addBiography.value,
            birthdate: form.addBirthdate.value
        };
        xhr.send(JSON.stringify(data));
    }

    function cancelAddDirectorForm() {
        document.getElementById('addDirectorForm').style.display = 'none';
    }

    function editDirector(did) {
        var xhr = new XMLHttpRequest();
        xhr.open('GET', '/director/infoDirector?did=' + did, true);
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4 && xhr.status === 200) {
                var response = JSON.parse(xhr.responseText);
                if (response.success) {
                    var director = response.directors;
                    var form = document.getElementById('editDirectorFormData');
                    form.editDid.value = director.did;
                    form.editDname.value = director.dname;
                    form.editBiography.value = director.biography;
                    form.editBirthdate.value = director.birthdate;
                    document.getElementById('editDirectorForm').style.display = 'block';
                } else {
                    alert(response.error);
                }
            }
        };
        xhr.send();
    }

    function submitEditDirectorForm() {
        var form = document.getElementById('editDirectorFormData');
        var xhr = new XMLHttpRequest();
        xhr.open('PUT', '/director/updateDirector', true);
        xhr.setRequestHeader('Content-Type', 'application/json');
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4 && xhr.status === 200) {
                var response = JSON.parse(xhr.responseText);
                if (response.success) {
                    alert(response.message);
                    location.reload();
                } else {
                    alert(response.message);
                }
            }
        };
        var data = {
            did: form.editDid.value,
            dname: form.editDname.value,
            biography: form.editBiography.value,
            birthdate: form.editBirthdate.value
        };
        xhr.send(JSON.stringify(data));
    }

    function cancelEditDirectorForm() {
        document.getElementById('editDirectorForm').style.display = 'none';
    }

    function deleteDirector(did) {
        if (confirm('确定要删除该导演信息吗？')) {
            var xhr = new XMLHttpRequest();
            xhr.open('DELETE', '/director/deleteDirector/' + did, true);
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4 && xhr.status === 200) {
                    var response = JSON.parse(xhr.responseText);
                    if (response.success) {
                        alert(response.message);
                        location.reload();
                    } else {
                        alert(response.message);
                    }
                }
            };
            xhr.send();
        }
    }
</script>
</body>
</html>